<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<link rel="stylesheet" href="${staticServer}/inc/style/page.css" />
<script src="${staticServer}/inc/js/jquery.js"></script>
<script src="${staticServer}/inc/js/pageset.js"></script>
<script src="${staticServer}/js/web/struct_department.js?1.5"></script>

<link rel="stylesheet" href="${staticServer}/css/zTreeStyle.css" type="text/css">
<script type="text/javascript" src="${staticServer}/js/web/jquery-1.4.4.min.js"></script>
	<script type="text/javascript" src="${staticServer}/js/web/jquery.ztree.core.js"></script>
	<script type="text/javascript" src="${staticServer}/js/web/jquery.ztree.excheck.js"></script>
	<script type="text/javascript" src="${staticServer}/js/web/jquery.ztree.exedit.js"></script>
	

<script>
var contextPath='${contextPath}';

$(function(){
	updateInfo();
});

var updateInfo = function(){
	var nickname = $("#nickname").val();
		
	$.post("${contextPath}/index/updateInfo.json", {
		"nickname" : nickname
	}, function(ms) {
			
	});
}

</script>
<SCRIPT type="text/javascript" >
var setting = {
			view: {
				addHoverDom: addHoverDom,
				removeHoverDom: removeHoverDom,
				selectedMulti: false
			},
			edit: {
				enable: true,
				editNameSelectAll: true
			},
			data: {
				simpleData: {
					enable: true
				}
			},
			callback: {
				beforeDrag: beforeDrag,
				beforeEditName: beforeEditName,
				beforeRemove: beforeRemove,
				beforeRename: beforeRename,
				onRemove: onRemove,
				onRename: onRename
			}
		};

		var zNodes =[
			<#if depList??>
			<#list depList as list>
				{id:${list.id}, pId:${list.id}, name:"${list.name}", children: [
					<#list list.list as list>
						{id: "${list.id}",name: "${list.name}",children: [
						<#list list.ulist as ulist>
							{name:"${ulist.nickname}"},
						</#list>
						]},
					</#list>
				],open:false},
			</#list>
			</#if>
		];
		var log, className = "dark";
		function beforeDrag(treeId, treeNodes) {
			return false;
		}
		function beforeEditName(treeId, treeNode) {
			className = (className === "dark" ? "":"dark");
			showLog("[ "+getTime()+" beforeEditName ]&nbsp;&nbsp;&nbsp;&nbsp; " + treeNode.name);
			var zTree = $.fn.zTree.getZTreeObj("treeDemo");
			zTree.selectNode(treeNode);
			return confirm("进入节点 -- " + treeNode.name + " 的编辑状态吗？");
		}
		function beforeRemove(treeId, treeNode) {
			className = (className === "dark" ? "":"dark");
			showLog("[ "+getTime()+" beforeRemove ]&nbsp;&nbsp;&nbsp;&nbsp; " + treeNode.name);
			var zTree = $.fn.zTree.getZTreeObj("treeDemo");
			zTree.selectNode(treeNode);
			return confirm("确认删除 节点 -- " + treeNode.name + " 吗？该操作会影响系统部分权限。");
		}
		function onRemove(e, treeId, treeNode) {
			$.post("${contextPath}/index/depar_del.json", {
				"id" : treeNode.id
			}, function(ms) {
				if(ms.msg=="2"){
					alert("一级职位不可删除。");
				}
			});
			showLog("[ "+getTime()+" onRemove ]&nbsp;&nbsp;&nbsp;&nbsp; " + treeNode.name);
		}
		function beforeRename(treeId, treeNode, newName, isCancel) {
			className = (className === "dark" ? "":"dark");
			showLog((isCancel ? "<span style='color:red'>":"") + "[ "+getTime()+" beforeRename ]&nbsp;&nbsp;&nbsp;&nbsp; " + treeNode.name + (isCancel ? "</span>":""));
			if (newName.length == 0) {
				alert("节点名称不能为空。");
				var zTree = $.fn.zTree.getZTreeObj("treeDemo");
				setTimeout(function(){zTree.editName(treeNode)}, 10);
				return false;
			}
			return true;
		}
		function onRename(e, treeId, treeNode, isCancel) {
			$.post("${contextPath}/index/depar_upd.json", {
				"id" : treeNode.id,
				"name" : treeNode.name
			}, function(ms) {
			});
			showLog((isCancel ? "<span style='color:red'>":"") + "[ "+getTime()+" onRename ]&nbsp;&nbsp;&nbsp;&nbsp; " + treeNode.name + (isCancel ? "</span>":""));
		}
		function showRemoveBtn(treeId, treeNode) {
			return !treeNode.isFirstNode;
		}
		function showRenameBtn(treeId, treeNode) {
			return !treeNode.isLastNode;
		}
		function showLog(str) {
			if (!log) log = $("#log");
			log.append("<li class='"+className+"'>"+str+"</li>");
			if(log.children("li").length > 8) {
				log.get(0).removeChild(log.children("li")[0]);
			}
		}
		function getTime() {
			var now= new Date(),
			h=now.getHours(),
			m=now.getMinutes(),
			s=now.getSeconds(),
			ms=now.getMilliseconds();
			return (h+":"+m+":"+s+ " " +ms);
		}

		var newCount = 1;
		function addHoverDom(treeId, treeNode) {
			var sObj = $("#" + treeNode.tId + "_span");
			if (treeNode.editNameFlag || $("#addBtn_"+treeNode.tId).length>0) return;
			var addStr = "<span class='button add' id='addBtn_" + treeNode.tId
				+ "' title='add node' onfocus='this.blur();'></span>";
			sObj.after(addStr);
			var btn = $("#addBtn_"+treeNode.tId);
			if (btn) btn.bind("click", function(){
				$.post("${contextPath}/index/depar_add.json", {
						"id" : treeNode.id,
						"name" : "new node"+newCount++
				}, function(ms) {
					if(ms.msg=="1"){
						location.reload();
					}
				});
				var zTree = $.fn.zTree.getZTreeObj("treeDemo");
				zTree.addNodes(treeNode, {id:(100 + newCount), pId:treeNode.id, name:"new node" + (newCount++)});
				return false;
			});
		};
		function removeHoverDom(treeId, treeNode) {
			$("#addBtn_"+treeNode.tId).unbind().remove();
		};
		function selectAll() {
			var zTree = $.fn.zTree.getZTreeObj("treeDemo");
			zTree.setting.edit.editNameSelectAll =  $("#selectAll").attr("checked");
		}
		
		$(document).ready(function(){
			$.fn.zTree.init($("#treeDemo"), setting, zNodes);
			$("#selectAll").bind("click", selectAll);
		});
		

  //-->
  </SCRIPT>
  
  <style type="text/css">
.ztree li span.button.add {margin-left:2px; margin-right: -1px; background-position:-144px 0; vertical-align:top; *vertical-align:middle}
	</style>
</head>

<body>
	<div id="container">
		<div id="title">部门结构展示图<a style="margin-left:30px;" href="${contextPath}/index/struct_qq_group.htm"><input type="button" class="submit" value="  切换QQ结构展示  " /></a></div>
<div class="content_wrap">
	<div class="zTreeDemoBackground left">
		<ul id="treeDemo" class="ztree"></ul>
	</div>
</div>

	</div>
</body>
</html>